layui.use(['laydate', 'form', 'table'],
    function () {
        var laydate = layui.laydate;
        let table = layui.table;
        let form = layui.form;

        //执行一个laydate实例
        laydate.render({
            elem: '#start' //指定元素
        });

        //执行一个laydate实例
        laydate.render({
            elem: '#end' //指定元素
        });


        //执行一个 table 实例
        table.render({
            elem: '#table'
            , height: 420
            , url: '/back/product/findAll' //数据接口
            // ,url: '../demo/table/user/-page=1&limit=20.js' //数据接口
            , title: '用户表'
            , page: true //开启分页
            ,parseData: function(res){ //res 即为原始返回的数据
                console.log(res)
                return {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.count, //解析数据长度
                    "data": res.data //解析数据列表
                };
            }
            // , toolbar: 'default' //开启工具栏，此处显示默认图标，可以自定义模板，详见文档
            // , totalRow: true //开启合计行
            , cols: [[ //表头

                {field: 'id', title: 'ID', width: 80, sort: true, fixed: 'left'}
                , {field: 'name', title: '用户名', width: 80}
                , {field: 'img', title: '图片展示', width: 90, sort: true, templet: '#imgHref'}
                , {field: 'normalPrice', title: '正常价', width: 80, sort: true}
                , {field: 'cuisineName', title: '菜系', width: 80, sort: true}
                , {field: 'enable', title: '状态', width: 150, templet: '#enable'}

                , {fixed: 'right', width: 200, align: 'center', toolbar: '#barDemo'}
            ]]
        });
        //监听状态操作
        form.on('switch(enable)', function (obj) {
            layer.msg(this.value +" "+this.myvalue+ ' ' + this.name + '：' + obj.elem.checked, obj.othis);
        });

        //监听行工具事件
        table.on('tool(table)', function (obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            var data = obj.data //获得当前行数据
                , layEvent = obj.event; //获得 lay-event 对应的值
            console.log(data);
            if (layEvent === 'detail') {
                layer.msg('查看操作');
            } else if (layEvent === 'edit') {
                //下拉菜单
                layer.msg('编辑');
            } else if (layEvent === 'edit') {
                //下拉菜单
                layer.msg('删除');
            }
        });


    });
